<!-- 分办管理 -->
<template>
  <view>
		<van-popup v-model="showCompo" closeable round position="bottom" :style="{ height: '100%' }"
				@click-close-icon="toClose" @click-overlay="toClose">
			<van-row type="flex" justify="center">
				<van-col offset="3" span="8">
					<van-cell value="分办管理" />
				</van-col>
			</van-row>
			<view class="padding-bottom">
				<van-cell icon="newspaper-o" title="已发送单位" title-class="text-bold"/>
				<view class="padding-left">
					<van-row justify="center">
						<van-col span="8">
							<van-cell title="分办处室" title-class="text-bold"></van-cell>
						</van-col>
						<van-col span="6">
							<van-cell title="当前环节" title-class="text-bold"></van-cell>
						</van-col>
						<van-col span="6">
							<van-cell title="办理状态" title-class="text-bold"></van-cell>
						</van-col>
						<van-col span="4">
							<van-cell title="操作" title-class="text-bold"></van-cell>
						</van-col>
					</van-row>
					<van-row justify="center" v-for="item in alreadyList" :key="item.fenbanDept">
						<template>
							<van-col span="8">
								<van-cell :title="item.fenbanDept"></van-cell>
							</van-col>
							<van-col span="6">
								<van-cell :title="item.taskNow"></van-cell>
							</van-col>
							<van-col span="6">
								<van-cell :title="item.state"></van-cell>
							</van-col>
							<van-col span="4">
								<van-cell title="恢复" v-if="item.state == '分办结束'" @click='recovery(item.subProInstId)'
													title-class="text-blue"></van-cell>
								<van-cell title="撤回" v-else @click='withdraw(item.subProInstId)'
													title-class="text-blue"></van-cell>
							</van-col>
						</template>
					</van-row>
				</view>
			</view>

			<view class="padding-bottom">
				<van-cell icon="sort" title="分办人员选择" title-class="text-bold"/>
        <view v-for="(item,index) in deptList" :key="item.dept.deptId">
          <van-cell>
            {{item.dept.deptName}}
          </van-cell>
          <van-grid :column-num="3" :border="false" :center="false" class="padding-left">
            <view style="width: 100%">
              <van-checkbox-group v-model="userChecked[index]" direction="horizontal" ref="user">
                <van-grid-item v-for="user in item.user" :key="user.userId">
                  <van-checkbox shape="square" :name="user.userId" icon-size="30rpx" :key="user.userId"
                                disabled
                                v-if="alreadyDeptId.filter(t => t == item.dept.deptId).length > 0">
                    {{user.userName}}
                  </van-checkbox>
                  <van-checkbox shape="square" :name="user.userId" icon-size="30rpx" :key="user.userId"
                                @click.native="checkUser(user.userId, index)"
                                v-else>
                    {{user.userName}}
                  </van-checkbox>
                </van-grid-item>
              </van-checkbox-group>
            </view>
          </van-grid>
        </view>
			</view>

			<view class="padding-top-lg padding-bottom-lg">
				<van-row type="flex" justify="space-around">
					<van-col span="10">
						<van-button type="info" round plain hairline block @click="toClose">取消</van-button>
					</van-col>
					<van-col span="10">
						<van-button type="info" round block @click="toSave">确定</van-button>
					</van-col>
				</van-row>
			</view>
		</van-popup>
	</view>
</template>

<script>

export default {
  props: {
    showFb: {
      type: Boolean,
      default: false
    },
    paramObject: {
      type: Object
    },
		gwTitle: {
      type: String,
      default: ''
    }
  },

  data() {
		return {
      showCompo: false,
			proInstId: '',      // openwfneededdata接口返回的proInstId
			configId: '',       // openwfneededdata接口返回的configId
			proDirId: '',       // openwfneededdata接口返回的proDirId
      actInstId: '',      // openwfneededdata接口返回的actInstId
			title: '',          // 公文详情中的title
      alreadyList: [],    // 已分办
      alreadyDeptId: [],  // 已分办部门id
      deptList: [],       // 部门
      selectedUser: [],   // 选中的用户
      userChecked: [],
		};
  },

	watch: {
    showFb(val) {
			this.showCompo = val
		},
		paramObject: {
			handler(nval, oval) {
				if (nval != null && JSON.stringify(nval) != "{}") {
					console.log('---------------paramObject.proInstId:' + nval.proInstId);
					this.proInstId = nval.proInstId
					this.configId = nval.configId
					this.proDirId = nval.proDirId
          this.actInstId = nval.actInstId
          // 已分办
					this.getAlreadyList(nval.proInstId)
				}
			},
			immediate: true,
			deep: true
		},
    gwTitle(val) {
      this.title = val
    }
	},

  mounted() {
    // 部门
    this.initDept()
  },

  methods: {
    // 单个选中
    checkUser(userId, index) {
      const flag = this.userChecked[index]
      if(this.util.isEmpty(flag) || !this.userChecked[index].includes(userId)) {
        this.$refs.user[index].toggleAll(false);
        this.userChecked[index].push(userId)
      }else {
        this.$refs.user[index].toggleAll(false);
      }
      console.log('userChecked--->' + JSON.stringify(this.userChecked))
    },

    // 已分办
    getAlreadyList(proInstId) {
      const _this = this
      _this.$http({
        url: _this.$http.adornUrl(`/caac/oa/mhjcomponent/countersign/countersignController/listSendedFenbanTrack`),
        method: 'get',
        params: _this.$http.adornParams({
          'systemKey': _this.cache.get('userInfo').systemKey,
          'systemFlag': _this.cache.get('userInfo').systemFlag,
          'proInstId': proInstId,
        })
      }).then(({data}) => {
        if (data.code == 200 && data.data.length > 0) {
          _this.alreadyList = data.data
          _this.alreadyDeptId = []
          for (let dept of data.data) {
            _this.alreadyDeptId.push(dept.fenbanDeptId)
          }
        } else {
          _this.alreadyList = []
          _this.alreadyDeptId = []
        }
      })
    },

    // 部门
    initDept() {
      const _this = this
      _this.$http({
        url: _this.$http.adornUrl(`/caac/oa/component/fb/allusers`),
        method: 'get',
        params: _this.$http.adornParams({
          'systemKey': _this.cache.get('userInfo').systemKey,
          'systemFlag': _this.cache.get('userInfo').systemFlag,
        })
      }).then(({data}) => {
        if (data.code == 200 && data.data.length > 0) {
          _this.deptList = data.data
        }
      })
    },


		// 取消按钮
		toClose(){
			this.$emit('closeFb', this.showCompo)
		},

		// 确定按钮
		toSave(){
      const _this = this
      _this.selectedUser = []
      if (_this.userChecked != null && _this.userChecked.length > 0) {
        _this.userChecked.forEach((item) => {
          if (_this.util.isNotEmpty(item)) {
            _this.selectedUser.push(item[0]);
          }
        })
      }
      console.log(_this.selectedUser.toString())
      if(_this.selectedUser.length > 0) {
        _this.save()
      } else {
        _this.$toast('请选择分办人员')
      }
		},

    save() {
      const _this = this
      _this.$httploading({
        url: _this.$httploading.adornUrl(`/caac/oa/component/fb/dofb`),
        method: 'post',
        params: _this.$httploading.adornParams({
          'systemKey': _this.cache.get('userInfo').systemKey,
          'systemFlag': _this.cache.get('userInfo').systemFlag,
        }),
        data:_this.$httploading.adornData({
          'proInstId': _this.proInstId,
          'users': _this.selectedUser.length > 0 ? _this.selectedUser.join(',') : '',
          'title': _this.title,
          'formCode': 'mhjswformreadonly',
          'importStatus': '0',
          'bizId': '',
          'wfmData': {
            'configId': _this.paramObject.configId,
            'proDirId': _this.paramObject.proDirId,
            'actDefId': _this.paramObject.actDefId,
            'proInstId':_this.paramObject.proInstId,
            'actInstId': _this.paramObject.actInstId,
            'workitemId': _this.paramObject.workitemId,
            'configCode': _this.paramObject.configCode,
          }
        })
      }).then(({data}) => {
        if (data.code == 200) {
          _this.$toast('分办成功')
          _this.userChecked = []
          _this.getAlreadyList(_this.proInstId)
          _this.$emit('refreshBtnGroup')
          _this.$emit('closeFb')
        }
      });
    },

    // 撤回
    withdraw(subProInstId) {
      const _this = this
      _this.$httploading({
        url: _this.$httploading.adornUrl(`/caac/oa/component/fb/remove`),
        method: 'post',
        params: _this.$httploading.adornParams({
          'systemKey': _this.cache.get('userInfo').systemKey,
          'systemFlag': _this.cache.get('userInfo').systemFlag,
          'data': _this.$httploading.adornData({
            'configId': _this.configId,
            'proInstId': _this.proInstId,
            'proDirId': _this.proDirId,
            'actInstId': _this.actInstId,
            'subProInstId': subProInstId
          }),
        }),
      }).then(({data}) => {
        if (data.code == 200) {
          _this.getAlreadyList(_this.proInstId)
          _this.$emit('refreshBtnGroup')
          _this.$toast('撤回成功')
        } else {
          _this.$toast(data.message + ' code:' + data.code)
        }
      })
    },

    // 恢复
    recovery(subProInstId) {
      const _this = this
      let url = '/caac/oa/mywork/selectparambyproinstid/' + subProInstId
      _this.$httploading({
        url: _this.$httploading.adornUrl(url),
        method: 'get',
        params: _this.$httploading.adornParams({
          'systemKey': _this.cache.get('userInfo').systemKey,
          'systemFlag': _this.cache.get('userInfo').systemFlag,
        }),
      }).then(({data}) => {
        if (data.code == 200) {
          _this.recoverySecond(data.data)
        } else {
          _this.$toast(data.message + ' code:' + data.code)
        }
      })
    },
    // 恢复2
    recoverySecond(item) {
      const _this = this
      _this.$httploading({
        url: _this.$httploading.adornUrl(`/caac/oa/component/workflow/workflowController/reviveprocess`),
        method: 'post',
        params: _this.$httploading.adornParams({
          'systemKey': _this.cache.get('userInfo').systemKey,
          'systemFlag': _this.cache.get('userInfo').systemFlag,
          'data': _this.$httploading.adornData({
            'configId': item.configId,
            'proDirId': item.proDirId,
            'proInstId': item.proInstId,
            'actDefId': item.actDefId,
            'actInstId': _this.actInstId,
          }),
        }),
      }).then(({data}) => {
        if (data.code == 200) {
          _this.getAlreadyList(_this.proInstId)
          _this.$toast('恢复成功')
        } else {
          _this.$toast(data.message + ' code:' + data.code)
        }
      })
    },

	},

}
</script>

<style>
	.action{
		width: auto !important;
		max-width: 150rpx !important;
	}

	.van-checkbox--horizontal {
		margin-right: 2px;
	}

	/deep/ .van-grid-item__content {
	    display: -webkit-box;
	    display: -webkit-flex;
	    display: flex;
	    -webkit-box-orient: vertical;
	    -webkit-box-direction: normal;
	    -webkit-flex-direction: column;
	    flex-direction: column;
	    box-sizing: border-box;
	    height: 100%;
	    padding: 10px 8px;
	    background-color: #fff;
	}

  .van-action-sheet{
    z-index: 9999;
    min-height: 80%;
  }
  .search-add{
    position: fixed;
    height: 120rpx;
    width: 100%;
    z-index: 90;
  }
  .content{
    margin: 120rpx 0;
  }
  .bottom-btn{
    background-color: #FFFFFF;
    padding: 15rpx 0;
    position: fixed;
    width: 100%;
    height: 120rpx;
    bottom: 0;
    z-index: 999;
  }
  .popup-box{
    display: block;
    width: 100%;
    height: auto;
    padding:100rpx 0 20rpx;
  }
  /deep/ .van-cell__title {
    min-width: 20% !important;
  }
</style>
